<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{padding: 0;margin: 0;list-style: none;text-decoration: none;box-sizing: border-box;}
        #box{margin: 20px auto;text-align: center;line-height: 50px;}
        #but{display: block;margin: 20px auto;}
    </style>
</head>
<body>

    <button id="but">点击一下</button>
    <div id="box"></div>
    <script>
        var but=document.getElementById('but'),
            box=document.getElementById('box'),
            str='江山如画岁月如歌从1949年到2024年从一穷二白到世界第二大经济体人民共和国跨越沧海桑田。习近平总书记在庆祝中华人民共和国成立75周年招待会上指出经过75年的艰苦奋斗中国式现代化已经展开壮美画卷并呈现出无比光明灿烂的前景在充满光荣与梦想的新征程上我们要锚定目标勠力同心开拓进取共同谱写人民共和国更加绚丽精彩的新篇章'
        but.onclick=function(){
            box.style.height=numFn(300,400)+'px'
            box.style.width=numFn(300,800)+'px'
            box.style.fontSize=numFn(14,30)+'px'
            box.style.background=colorFn(colorStr,6)
            box.style.color=colorFn(colorStr,3)
            box.innerHTML=str.substr(numFn(0,126),numFn(15,30))
        }

        function numFn(min,max){
            return Math.floor(Math.random()*(max-min+1)+min)
        }
        var colorStr='0123456789abcdefABCDEF'
        function colorFn(colorStr,n){
            var resColor='#'
            for(i=0;i<n;i++){
                var num=numFn(0,colorStr.length-1)
                resColor+=colorStr[num]
            }
            return resColor
        }

        // function colorFn( color , buf ){
        //     var bg = "#"
        //     // 按照指定的进制buf循环   十六->6 #CCf25D  八进制->3 #CCC
        //     for(var i = 0 ; i < buf ; i++){
        //         // 生成随机下标
        //         var index = randomNum(0 , color.length - 1);
        //         // 通过下标 找到对应的字符 拼接
        //         bg += color[index]
        //     }
        //     return bg
        // }
        // 1
        // var arr=[10,5,2]
        // function fun(arr){
        //     return arr.map(item=>item+10)
        // }
        // console.log(fun(arr))

        // 4
        // var str = "ab3c6d10",
        //     str1='54ab201c5s20',
        //     str2='jh50h40o10'

        // function fun(str){
        //     var res=[]
        //     var num=''
        //     for(i=0;i<str.length;i++){
        //         if(!isNaN(str[i])){
        //             num+=str[i]
        //             for(j=i+1;j<str.length;j++){
        //             if(isNaN(str[j])){
        //                 break
        //             }else{
        //                 num+=str[j]
        //             } 
        //         }
        //         res.push(num)
        //         num=''
        //         i=j
        //         }
        //     }
        //     return res
        // }
        // console.log(fun(str))
        // console.log(fun(str1))
        // console.log(fun(str2))

        // 5
        // var arr = [[1,2,3],[4,5],[6,7,8]]
        // function fun(arr){
        //     var res=[]
        //     for(i=0;i<arr.length;i++){
        //         for(j=0;j<arr[i].length;j++){
        //             res.push(arr[i][j])
        //         }
        //     }
        //     for(i=0;i<arr.length;i++){
        //         res=res.concat(arr[i])
        //     }
        //     return res
        // }
        // console.log(fun(arr))

        // 1
        // function fun(arr){
        //     var res=0
        //     for(i=0;i<arr.length;i++){
        //         for(j=0;j<arr[i].length;j++){
        //             res+=arr[i][j]
        //         }
        //     }
        //     return res
        // }

        
        // 3
        // var arr = [[1,2,3,4],["A","B","C","D"],["东","南","西","北"]]
        // function fun(arr){
        //     var res=[]
        //     for(i=0;i<arr[0].length;i++){
        //         var res1=[]
        //         for(j=0;j<arr.length;j++){
        //             res1.push(arr[j][i])
        //         }
        //         res.push(res1)
        //     }
        //     return res
        // }
        // console.log(fun(arr))

        


        // 1
        // var arr = ['a','b','c','a','b','c','d']
        // function fun(arr){
        //     var resArr=[]
        //     for(i=0;i<arr.length;i++){
        //         if(resArr.indexOf(arr[i])===-1){resArr.push(arr[i])}
        //     }
        //     return resArr
        // }
        // console.log(fun(arr))


        // 2
        // function fun(min,max,n){
        //     var resArr=[]
        //     while(resArr.length<n){
        //         var num=Math.floor(Math.random()*(max-min+1)+min)
        //         if(resArr.indexOf(num)===-1){ resArr.push(num)}
        //     }
        //     return resArr.sort(function(a,b){return b-a})
        // }
        // console.log(fun(0,10,3))
        // console.log(fun(10,50,5))


        // 3,4
        // function myIndexOf(arr,n){
        //     for(s=0;s<arr.length;s++){
        //         if(arr[s]===n){return s}
        //     }
        //     return -1
        // }
        // console.log(myIndexOf([5,8,9,10],90))

        // var arr1 = ['a','a','b','b','c','d','e','d','e','a']
        //     arr2 = [10,20,30,10,20,50,30]
        // function fun(arr1){
        //     var res =[]
        //     for(i=0;i<arr1.length;i++){
        //         if(myIndexOf(res,arr1[i])===-1){
        //             res.push(arr1[i])
        //         }
        //     }
        //     return res
        // }
        // console.log(fun(arr1))
        // console.log(fun(arr2))


        // 6
        // function myJoin(arr,chart=','){
        //     var res=''
        //     for(i=0;i<arr.length;i++){
        //         res+=arr[i]+(i!==arr.length-1? chart:'')
        //     }
        //     return res
        // }
        // console.log(myJoin(arr1))
        // console.log(myJoin(arr1,' & '))


        // 7
        // var str='jabcjabljabcopl'
        // function mySplit(str,chart){
        //     var res=[]
        //     if(typeof chart==='undefined'){
        //         res.push(str)
        //         return res
        //     }
        //     var si=0
        //     for(i=0;i<str.length;i++){                
        //         if(str.substr(i,chart.length)===chart){
        //             res.push(str.slice(si,i))
        //             si=i+chart.length
        //             i++
        //         }
        //     }
        //     res.push(str.substr(si))
        //     return res
            
        // }
        // console.log(mySplit(str,'a'))
        // console.log(mySplit(str,'ab'))

       








    </script>
</body>
</html>